<template>
	<div id="detail">
		<el-descriptions title="" direction="vertical" :column="6" border>
			<el-descriptions-item label="名称">{{tableData.name}}</el-descriptions-item>
			<el-descriptions-item label="介绍名称">{{tableData.desc}}</el-descriptions-item>
			<el-descriptions-item label="标签">{{tableData.tag}}</el-descriptions-item>
			<el-descriptions-item label="优惠券类型">{{tableData.type == 0 ?'通用领卷':tableData.type == 1 ?'注册赠卷':"兑换码"}}
			</el-descriptions-item>
			<el-descriptions-item label="最低消费">满{{tableData.min}}元可用</el-descriptions-item>
			<el-descriptions-item label="优惠面值">减免{{tableData.discount}}元</el-descriptions-item>
			<el-descriptions-item label="每人限额">{{tableData.limit}}</el-descriptions-item>
			<el-descriptions-item label="当前状态">{{tableData.status == 0 ?'正常':tableData.status == 1 ?'已过期':"已下架"}}</el-descriptions-item>
			<el-descriptions-item label="商品范围">{{tableData.goodsType == 0 ?'全场通用':tableData.goodsType == 1 ?'指定分类':"指定商品"}}</el-descriptions-item>
			<el-descriptions-item label="有效期">限领{{tableData.days}}天有效</el-descriptions-item>
			<el-descriptions-item label="优惠兑换码">{{tableData.code}}</el-descriptions-item>
			<el-descriptions-item label="发行数量">{{tableData.total == 0 ?'不限':tableData.total}}</el-descriptions-item>
		</el-descriptions>
		<div class="top">
			<el-input placeholder="请输入用户ID" v-model="user" size="medium" style="width: 20%;" clearable></el-input>
			<el-select v-model="state" placeholder="请选择使用状态" size="medium" clearable style="margin: 0px 10px;">
				<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
				</el-option>
			</el-select>
			<el-button type="primary" icon="el-icon-search" size="medium">查找</el-button>
		</div>
		<div class="content">
			<template>
				<el-table :data="list" border style="width: 100%;" header-align="center" row-key="id">
					<el-table-column prop="id" label="用户优惠券ID" sortable>
					</el-table-column>
					<el-table-column prop="username" label="用户ID">
					</el-table-column>
					<el-table-column prop="" label="领取时间">
					</el-table-column>
					<el-table-column prop="admin" label="使用状态">
					</el-table-column>
					<el-table-column prop="handle" label="订单ID">
					</el-table-column>
					<el-table-column prop="handle" label="使用时间">
					</el-table-column>
				</el-table>
			</template>
		</div>
	</div>
</template>

<script>
	import {
		saleread
	} from '@/api/http.js'
	export default {
		data() {
			return {
				user: '',
				list: [],
				tableData: '',
				options: [{
					value: 0,
					label: '未使用'
				}, {
					value: 1,
					label: '已使用'
				}, {
					value: 2,
					label: '已过期'
				}, {
					value: 3,
					label: '已下架'
				}],
				state: ''
			}
		},
		activated() {
			this.form()//渲染数据
		},
		methods: {
			form() {
				// console.log( this.$route.query.id)
				saleread({
					id: this.$route.query.id
				}).then((res) => {
					// console.log(res)
					this.tableData = res.data.data
				})
			}
		},
	}
</script>

<style>
	#detail .top {
		margin: 20px 0px;
	}
</style>
